<template>
  <div class="container">
    <!-- <header-ad></header-ad> -->
    <nav-login></nav-login>
    <div class="w1200">
      <div class="cartStep">
        <cart-logo></cart-logo>
        <cart-step :steps="steps"></cart-step>
      </div>

      <cart-details @lists="lists"></cart-details>
      <your-like :listsz="product"></your-like>
    </div>

    <bottom-nav></bottom-nav>
    <home-footer></home-footer>
  </div>
</template>
<script>
import yourLike from "../productDetails/components/YourLike"; //  猜你喜欢
import cartStep from "./components/CartStep"; // 步骤
import CartLogo from "./components/Logo"; // logo
import cartDetails from "./components/CartDetails"; // 购物车主体详情部分
import goods from "../../assets/images/goods1.png"; // 图片
export default {
  name: "shoppingCart",

  data() {
    return {
      steps: 1,
      product: {
        title: "关联商品",
        lists: [
          // {
          //   imgsrc: goods,
          //   name: "SUS304定位销",
          //   describe: "交期大幅度缩短",
          //   price: "134.00",
          //   originalPrice: "299.99",
          //   id: 6
          // },
        ]
      }
    };
  },
  components: {
    yourLike,
    cartStep,
    CartLogo,
    cartDetails
  },
  methods: {
    // 关联商品
    lists(lists) {
      this.product.lists =lists
    }
  }
};
</script>
<style lang="scss" scoped>
.w1200 {
  width: 1200px;
  margin: auto;

  .cartStep {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .Tips {
    line-height: 48px;
    border: 1px solid #f3f3f3;
    color: #2d2d2d;
    text-indent: 34px;
    font-size: 14px;
  }
}
</style>
